<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Barreminas</title>
  <link href="css/style.css" type="text/css" rel="stylesheet" />
  <script type="text/javascript" src="scripts/jquery-1.4.1.js"></script>  
</head>
<body>
<div class="container">
  <header>
    <div align="center"><img src="img/Picture2.png" width="980" height="200"></div>
  </header>
  <div id="pantallaJuego" class="pantallas">
    <div class="sidebar1">
      <ul class="nav">
        <li><a id="salirDelJuego" href="#">Salir del Juego</a></li>
        <li><a id="lnkGuardarPartida" href="#">Guardar Partida</a></li>
        <li><a href="pantallaEstadisticas" class="navegacion">Ayuda</a></li>
      </ul>
      <aside>        
        <div>
          <div id="estadoTurno">Turno Activo</div>
          <div id="movimientosDisponibles"></div>
          <div id="tituloAcciones">Acciones</div>
          <div id="paletaAcciones">
          </div>          
        </div>
        <div>
          <table width="100%" align="center" border="1" cellpadding="2" cellspacing="0">
            <tbody><tr>
              <th colspan="2">Coordenadas</th>
            </tr>
            <tr>
              <td width="50%" align="center">X</td>
              <td width="50%" align="center">Y</td>
            </tr>
            <tr>
              <td width="50%" align="center"><span id="x">0</span></td>
              <td width="50%" align="center"><span id="y">0</span></td>
            </tr>
          </tbody>
        </table>              
        </div>        
        <div id="pnlAcciones">
          <input id="btnEjecutarAccion" type="button" value="Ejecutar Accion" class="classAcciones" /><br />
          <input id="btnFinalizarTurno" type="button" value="Finalizar Turno" class="classAcciones" />
        </div>        
      </aside>
    </div> 
    <canvas id="myCanvas" width="800" height="800"> </canvas>
  </div>
  <div id="pantallaInicio" class="pantallas">
    <p>BIENVENIDO A BARREMINAS </p>
    <ul>
      <li><a href="pantallaCrearPartida" class="navegacion">Iniciar Partida</a></li>
      <li><a id="lnkUnirPartida" href="#">Unir a Partida</a></li>  
      <li><a id="lnkCargarPartida" href="#">Cargar Partida</a> </li>
      <li><a href="#">Ayuda</a></li>   
    </ul>
  </div>
  <div id="pantallaCrearPartida" class="pantallas">
    <div id="divCrearPartida">
      <div class="navVolver"><a href="pantallaInicio" class="navegacion">Volver</a></div>
      <fieldset id="fldCrearPartida">
          <legend>Crear Partida:</legend>
          <table align="center">
            <tr>
                <td>Nombre Partida:</td>
                <td><input id="txtNombrePartida" type="text" /></td>
            </tr>
            <tr>
                <td>Tipo Barco:</td>
                <td>
                  <select id="selTipoBarco">                    
                  </select>
                </td>
            </tr>
            <tr>
                <td></td>
                <td><a id="lnkCrearPartida" href="#">Crear</a></td>
            </tr>
          </table>
        </fieldset>
    </div>
  </div>
  <div id="pantallaListaPartidas" class="pantallas">
      <div class="navVolver"><a href="pantallaInicio" class="navegacion">Volver</a></div>
      <div id="listarPartidas"></div>
  </div>
  <div id="pantallaRecuperarJuego" class="pantallas">
  </div>
  <div id="pantallaEstadisticas" class="pantallas">
    Pantalla Estadisticas
  </div>
  <footer align="center">
    <p>UDE – Facultad de ingeniería           
      3º Año Carrera Licenciatura en Informática  - Documentación -Proyecto 2012 </p>
  </footer>
  <!-- end .container --></div>
    <script type="text/javascript" src="scripts/classes/Enums.js"></script>    
    <script type="text/javascript" src="scripts/classes/ManejadorVentanas.js"></script>    
    <script type="text/javascript" src="scripts/classes/Reloj.js"></script>
    <script type="text/javascript" src="scripts/classes/Animacion.js"></script>
    <script type="text/javascript" src="scripts/classes/ManejadorRecursos.js"></script>
    <script type="text/javascript" src="scripts/classes/Objeto.js"></script>
    <script type="text/javascript" src="scripts/classes/MotorJuego.js"></script>
    <script type="text/javascript" src="scripts/classes/Mina.js"></script>
    <script type="text/javascript" src="scripts/classes/Barco.js"></script>
    <script type="text/javascript" src="scripts/classes/Explocion.js"></script>
    <script type="text/javascript" src="scripts/classes/Bala.js"></script>        
    <script type="text/javascript" src="scripts/classes/JuegoBuscaminas.js"></script>   
    <script type="text/javascript">
      var canvas = document.getElementById('myCanvas');
      var ctx = canvas.getContext('2d');
      var juego = new JuegoBuscaminas();
      var MANEJADOR_RECURSOS = new ManejadorRecursos();
      var tipoBarco = -1;

      $("#lnkCrearPartida").click(function(){

          var nombre = $("#txtNombrePartida").val();
          if($.trim(nombre) != ""){
            tipoBarco = $("#selTipoBarco option:selected").val();
            juego.crearPartida(nombre, tipoBarco);
          }
          else{
            alert("Debe ingresar un nombre para la partida");
          }
       });

      $("#lnkUnirPartida").click(function(){
        juego.listarPartidas();
      });

      //guarda la partida
      $("#lnkGuardarPartida").click(function(){        
        if(this.estado == TipoEstado.JUGANDO){
          if(juego.idJugador != null && juego.partidaActiva){
            if(prompt("Para guardar la partida, copie y guarde el código presentado en teste dialogo.\nPara recuperar la misma, este código le será solicitado", juego.idJugador) != null){
              juego.guardarPartida();
              console.info("PARTIDA GUARDADA");
            }
          } 
        }
        else{
           alert("La partida no se puede guardar en este momento");
        }
        return false; 
      });

      //cargar partida
      $("#lnkCargarPartida").click(function(){
        if(!juego.partidaActiva){
          var codigo = prompt("Ingrese el código de la partida guardada para recuperarla.")
          if(codigo != null && codigo != ""){
            juego.cargarPartida(codigo);
            console.info("PARTIDA CARGADA");
          }
        }              
        return false;
      });

      //Finalizao la partida en caso de que algun jugador cierre la ventana
      window.onbeforeunload = function(){
        if(juego.partidaActiva){
          juego.finalizarPartida();          
        }        
      }    
    </script>
</body>
</html>
